<template>
	<el-dialog
		:visible.sync="evalDialog"
		width="800px"
		class="evalDialog">
		<h3 class="title"><span></span>{{options.title}}</h3>
		
		<comTable :options="options.tableList" @delAccount="openDeleteDialog"></comTable>
		<!-- 删除操作弹窗 -->
		<praUnreported ref="del" :options="del" @subDel="submitDelete"></praUnreported>
		<!-- 分页器 -->
		<div class="pageBox">
			<el-pagination
				@size-change="handleSizeChange"
				@current-change="pageChange"
				:current-page.sync="cur"
				:page-sizes="[10, 20, 30, 50, 100]"
				:page-size="pageSize"
				layout="total, sizes, prev, pager, next, jumper"
				:total="options.totalNum"
				background
			></el-pagination>
		</div>
	</el-dialog>
</template>

<script>
export default{
	components:{
		comTable: () => import("./comTable.vue"),
		praUnreported: () => import("../common/praUnreported.vue"),
	},
	props:{
		options:{
			type: Object,
			require: true
		}
	},
	data(){
		return {
			evalDialog:false,
			del:{
				title:'删除',
				linefeedPre:'确认是否删除该下级账户',
				linefeedNext:'',
				subCon:'确认并删除',
				eventName:'subDel',
				modal:false
			},	
			delMsg:{},
			/* 分页功能数据 */
			cur:1,
			pageSize: 10,
			// totalNum: 415,				//总共有多少条数据,根据这个数据去适配页数
		}
	},
	methods:{
		open(){
			this.evalDialog = true;
		},
		close(){
			this.evalDialog = false;
		},
		
		// 打开删除操作弹窗
		openDeleteDialog(index){
			console.log(index);
			this.delMsg = index;
			this.$refs.del.open();
		},
		// 提交删除数据操作
		submitDelete(){
			//请求数据,提交接口
			console.log(this.delMsg.subordinateId);
			this.$houseAxios.post('/housekeeping/Subordinate/deleteSubordinate',{subordinateId:this.delMsg.subordinateId}).then(res => {
				console.log(res);
				if(res.data.code === 1000){
					this.$message({
						message: res.data.message,
						type:'success'
					});
					this.$emit('updataList',this.options.principalMsg);
				}
			})
			this.$refs.del.close();
		},
		//当前页是第几页,点击的第几页的时候调用这个函数
		pageChange(p) {
			// 点击的时候传过来一个参数，这个参数就是所点击的当前页数，
			// 然后把这个当前页数转换成字符串形式赋值给page，
			// 然后把page这个参数传给search这个方法
			console.log(p);
			let page = p.toString();
		},
		//每页有多少条,10,20,50等,点击选择的时候调用这个方法
		handleSizeChange (val) {
			console.log(val);
			this.pagesize = val
			
		},
	}
}
</script>

<style scoped="scoped">
.evalDialog{
	min-height: 700px;
}
.evalDialog .title{
	height: 60px;
	line-height: 60px;
	font-size: 15px;
	font-weight: bold;
	border-bottom: 1px solid #D2D2D2;
	padding: 0 0 0 30px;
}
.evalDialog .title span{
	width: 10px;height: 20px;
	float: left;background: #0064E4;
	margin: 20px 15px 0 0;
}
.pageBox{
	padding-bottom: 20px;
}
</style>
